<template>
  <div class="card_key">
    <div class="header_title">
      <span>发卡机预存款来源配置</span>
    </div>
    <div class="card_list">
      <el-form
        ref="alldata"
        :model="alldata"
        :rules="alldatarule"
        :label-position="labelPosition"
        label-width="110px"
        class="clearfix"
      >
        <el-col :span="8">
          <el-form-item label="预存款来源:" prop="depositType">
            <el-col :span="20">
              <el-select v-model="alldata.depositType" placeholder="请选择" size="mini">
                <el-option
                  v-for="item in depositTypeOption"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>
            </el-col>
            <!-- <el-col :span="4">
              <el-popover placement="rigth" width="400" trigger="click">
                <div>
                  <span style="color:red">优先导入</span>当导入中预存款金额为0时，则采用分组的预存款作为标准
                </div>
                <div>
                  <span style="color:red">优先分组</span>当分组中预存款金额为0时，则采用导入的预存款作为标准
                </div>
                <div slot="reference">
                  <el-button size="medium" class="tishi">提示</el-button>
                </div>
              </el-popover>
            </el-col> -->
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item>
            <el-col :span="18">
              <el-button type="primary" @click="onSubmit()">保存信息</el-button>
            </el-col>
          </el-form-item>
        </el-col>
      </el-form>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      depositTypeOption: [
        {
          label: '导入',
          value: 1
        },
        {
          label: '分组',
          value: 2
        },
        // {
        //   label: '优先导入',
        //   value: 3
        // },
        // {
        //   label: '优先分组',
        //   value: 4
        // }
      ],
      alldata: {
        depositType: 4
      },
      alldatarule: {},
      labelPosition: 'right'
    }
  },
  computed: {
    changeschoolid: {
      get() {
        return this.$store.state.user.changeschoolid
      }
    }
  },
  mounted() {
    this.getcardcofing()
  },
  methods: {
    //获取卡配置参数
    getcardcofing() {
      this.$http({
        url: this.$http.adornUrl('/card/self-issuing-config-search'),
        method: 'post',
        data: this.$http.adornData({
          messageContent: {
            unitGuid: this.changeschoolid
          },
          messageType: 0
        })
      }).then(({ data }) => {
        if (data.messageCode == 200) {
          this.alldata = { ...data.messageContent }
        } else {
          this.$message({
            showClose: true,
            message: data.errorMessage,
            type: 'error'
          })
        }
      })
    },
    //更改信息
    updatedcard() {
      this.$http({
        url: this.$http.adornUrl('/card/self-issuing-config-save'),
        method: 'post',
        data: this.$http.adornData({
          messageContent: {
            unitGuid: this.changeschoolid,
            ...this.alldata
          },
          messageType: 0
        })
      }).then(({ data }) => {
        if (data.messageCode == 200) {
          this.$message({
            showClose: true,
            message: '发卡机预存款来源配置成功',
            type: 'success'
          })
          this.getcardcofing()
        } else {
          this.$message({
            showClose: true,
            message: data.errorMessage,
            type: 'error'
          })
        }
      })
    },
    //修改信息
    onSubmit() {
      this.updatedcard()
    }
  }
}
</script>

<style lang="scss" scoped>
.card_key {
  padding: 10px;
  .clearfix:after {
    content: '.';
    clear: both;
    height: 0;
    overflow: hidden;
    visibility: hidden;
    display: block;
  }
  .clearfix {
    zoom: 1;
  }
  .header_title {
    height: 50px;
    line-height: 50px;
    border-bottom: 1px solid #e5e9f2;
    color: #909399;
  }
  .card_list {
    font-size: 16px;
    font-weight: bold;
    color: #909399;
    padding-top: 20px;
    .el-form-item {
      padding-left: 22px;
      // padding-top: 5px;
      height: 50px;
      line-height: 70px;
      margin-bottom: 0px;
      width: 100%;
    }
    .el-form-item:last-child {
      border-bottom: 0px solid #e5e9f2;
    }
    // .saveinfo{
    //     border-top: 1px solid #e5e9f2;
    //     padding-top: 20px;
    //     display: flex;
    //     justify-content: center;
    //     align-items: center;
    // }
  }
}
</style>